<template>
  <div class="formBox">
      <t-form ref="form" :model="searchData" label-width="98">
          <t-row>
              <t-col>
                  <t-form-item label="护理项目名称：" name="name">
                      <t-input placeholder="请输入内容" v-model="searchData.name" class="form-item-content" type="search"
                          clearable @clear="handleClear('name')" />
                  </t-form-item>
              </t-col>
              <t-col>
                  <t-form-item label="状态：" name="status">
                      <t-select clearable v-model="searchData.status" placeholder="请输入内容" @clear="handleClear('status')"> 
                          <t-option v-for="(item, index) in statusData" :key="index" :value="item.id" :label="item.value"
                              title="" />
                      </t-select>
                  </t-form-item>
              </t-col>
              <t-col class="searchBtn">
                  <button type="button" class="bt-grey wt-60" @click="handleReset()" >重置</button>
                  <button type="button" class="bt wt-60" @click="handleSearch()">搜索</button> 
              </t-col>
          </t-row>
      </t-form>

  </div>
</template>

<script setup lang="ts">
import { statusData } from '@/utils/commonData'
/* 父传子：接收搜索条件数据 */
let prop =   defineProps({
      searchData: {
        type: Object,
        default: () => {
          return {}
        }
      }
    });

/* 子传父 */
let emit = defineEmits(["handleClear","handleSearch","handleReset"]);
const handleClear = (val: string) => {
  emit('handleClear',val)
}

const handleSearch = () => {
  emit('handleSearch')
}

const handleReset = () => {
  emit('handleReset')
}

</script>